<template>
	<view class="container">
		<view style="margin-bottom: 10px;" v-show="!hasStore">
			<u-alert-tips type="warning" title=" " description="提示：当前位置超出了配送范围"></u-alert-tips>
		</view>
		<view class="map bg-fff receiveDetail" v-if="form.detail">
			<view class="viewAddress">
				<view class="address">
					{{form.detail?form.detail:''}}
				</view>
				<view class="region">
					{{form.region?form.region:''}}
				</view>
			</view>
			<view class="changeBtn">
				<u-button type="warning" plain size="mini" @click="jump('/pages/mine/address/warehouse')">修改地址</u-button>
			</view>
		</view>
		

		<view class="form bg-fff">
			<u-button v-if="!form.detail" type="warning" @click="jump('/pages/mine/address/warehouse')" :plain="true">选择收货地址 <u-icon name="arrow-right" size="26rpx"></u-icon></u-button>
			<!-- <view class="map-select" @click="jump('/pages/mine/address/warehouse')">
				<view class="">{{storeInfo.store_name || "选择收货地址"}}<u-icon name="arrow-right" size="26rpx" color="#333"></u-icon></view>
			</view> -->
			<!-- <view>
				{{form.detail?'收货地址:'+form.detail:''}}
			</view> -->
			<u-form ref="uForm">
				<u-form-item label-width="150rpx" label="详细地址">
					<u-input v-model="form.house_number" placeholder="如3单元8室" />
				</u-form-item>
				<u-form-item label-width="150rpx" label="联系人">
					<u-input v-model="form.name" />
				</u-form-item>
				<u-form-item label-width="150rpx" label="手机号">
					<u-input v-model="form.phone" />
				</u-form-item>
			</u-form>
			<view class="form-item" style="display: none;">
				<view class="form-item-label">省市区</view>
				<input type="text" disabled v-model="form.region" @click="regionShow = !regionShow" />
			</view>
			<view style="width: 100%;margin-top: 40rpx;">
				<u-button type="error"  @click="send">保存地址</u-button>
			</view>
			
		</view>

		


		<u-select v-model="regionShow" mode="mutil-column-auto" :default-value="regionDefault" :list="regionList"
			@confirm="regionConfirm"></u-select>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				hasStore: true,
				form: {},
				regionList: [],
				regionShow: false,
				regionDefault: [0, 0, 0],
				longitude: 0,
				latitude: 0,
				storeInfo: {},
				warehouseInfo: {},
				
			}
		},
		onLoad(options) {
			if (!uni.$u.test.isEmpty(options.address_id)) {
				this.form.address_id = options.address_id;
			}

			this.getHttp();
			// uni.getLocation({
			// 	type: 'wgs84',
			// 	success: (res) => {
			// 		this.longitude = res.longitude;
			// 		this.latitude = res.latitude;
			// 		// console.log('当前位置的经度：' + res.longitude);
			// 		// console.log('当前位置的纬度：' + res.latitude);
			// 	},
			// });
		},
		onUnload() {
			getApp().globalData.warehouseInfo = {};
		},
		onShow() {
			// if(!uni.$u.test.isEmpty(getApp().globalData.storeInfo)) {
			// 	this.storeInfo = getApp().globalData.storeInfo;
			// }
			if (!uni.$u.test.isEmpty(getApp().globalData.warehouseInfo)) {
				this.warehouseInfo = getApp().globalData.warehouseInfo;
				this.getOrderCheckScope(this.warehouseInfo['longitude'], this.warehouseInfo['latitude'])
				this.regionList.forEach((item, index) => {
					if (item.label == this.warehouseInfo.province) {
						this.form.province_id = item.value;

						item.children.forEach((it, idx) => {
							if (it.label == this.warehouseInfo.city) {
								this.form.city_id = it.value;

								it.children.forEach((i, ix) => {
									if (i.label == this.warehouseInfo.district) {
										this.form.region_id = i.value;

										this.regionDefault = [index, idx, ix];

										this.$set(this.form, 'region', this.warehouseInfo
											.province + this.warehouseInfo.city + this
											.warehouseInfo.district);
										this.$set(this.form, 'detail', this.warehouseInfo.title);
									}
								})
							}
						})
					}
				})

				if (uni.$u.test.isEmpty(this.form.region)) {
					uni.showToast({
						title: "地区匹配错误，请手动选择",
						icon: "none",
						duration: 2000
					})
				}
			}
		},
		methods: {
			getOrderCheckScope(longitude, latitude) {
				uni.$u.api.getOrderCheckScope({
					longitude: longitude,
					latitude: latitude,
				}).then(res => {
					let storeList = res.storeList;

					if (storeList.length == 0) {
						console.log('没有配送门店')
						this.hasStore = false
					} else {
						console.log('有配送门店')
						this.hasStore = true
					}

				})
			},
			jump(url) {
				uni.navigateTo({
					url: url
				})
			},
			send() {
				// if(uni.$u.test.isEmpty(this.storeInfo)) {
				// 	uni.showToast({
				// 		title: "请选择配送门店",
				// 		icon: "none"
				// 	})
				// } else 
				// if(uni.$u.test.isEmpty(this.form.region)) {
				// 	uni.showToast({
				// 		title: "请选择省市区",
				// 		icon: "none"
				// 	})
				// } else 
				if (!uni.$u.test.mobile(this.form.phone)) {
					uni.showToast({
						title: "请填写正确的手机号码",
						icon: "none"
					})
					return
				}
				if (uni.$u.test.isEmpty(this.form.detail)) {
					uni.showToast({
						title: "请选择收货地址",
						icon: "none"
					})
				} else if (uni.$u.test.isEmpty(this.form.name)) {
					uni.showToast({
						title: "请输入联系人",
						icon: "none"
					})
				} else if (uni.$u.test.isEmpty(this.form.phone)) {
					uni.showToast({
						title: "请输入手机号",
						icon: "none"
					})
				} else {
					// this.form.longitude = this.storeInfo.longitude;
					// this.form.latitude = this.storeInfo.latitude;

					// uni.$u.api.tencentMapAddress(this.form.region+this.form.detail).then(res => {
					// let longitude = res.data.result.location.lng;
					// let latitude = res.data.result.location.lat;

					if (uni.$u.test.isEmpty(this.warehouseInfo)) {
						uni.showToast({
							title: "请设置收货地址",
							icon: "none"
						})

						return;
					}

					let longitude = this.warehouseInfo.longitude;
					let latitude = this.warehouseInfo.latitude;

					uni.$u.api.getOrderCheckScope({
						longitude: longitude,
						latitude: latitude,
					}).then(res => {
						this.storeList = res.storeList;

						// if(this.storeList.length > 0) {
						this.form.longitude = longitude;
						this.form.latitude = latitude;

						if (!uni.$u.test.isEmpty(this.form.address_id)) {
							uni.$u.api.postAddressEdit(this.form).then(res => {
								uni.navigateBack();
							})
						} else {
							uni.$u.api.postAddress(this.form).then(res => {
								uni.navigateBack();
							})
						}
						// } else {
						// 	uni.showToast({
						// 		title: "该地址不在配送范围",
						// 		icon: "none"
						// 	})
						// }
					})
					// })

				}
			},
			regionConfirm(e) {
				this.form.province_id = e[0].value;
				this.form.city_id = e[1].value;
				this.form.region_id = e[2].value;
				this.$set(this.form, 'region', e[0].label + e[1].label + e[2].label);

				this.regionList.forEach((item, index) => {
					if (item.label == e[0].label) {
						item.children.forEach((it, idx) => {
							if (it.label == e[1].label) {
								it.children.forEach((i, ix) => {
									if (i.label == e[2].label) {
										this.regionDefault = [index, idx, ix];
									}
								})
							}
						})
					}
				})
			},
			getRegion() {
				uni.$u.api.getRegion().then(res => {
					this.regionList = res.regionData;
				})
			},
			getAddressDetail() {
				uni.$u.api.getAddressDetail({
					address_id: this.form.address_id,
				}).then(res => {
					this.form = res.detail;
					this.form.region = res.detail.region.province + res.detail.region.city + res.detail.region
						.region;
					this.regionList = res.regionData;
					this.warehouseInfo = {
						longitude: res.detail.longitude,
						latitude: res.detail.latitude,
					};
					this.regionList.forEach((item, index) => {
						if (item.label == res.region[0]) {
							item.children.forEach((it, idx) => {
								if (it.label == res.region[1]) {
									it.children.forEach((i, ix) => {
										if (i.label == res.region[2]) {
											this.regionDefault = [index, idx, ix];
										}
									})
								}
							})
						}
					})
				})
			},
			getHttp() {
				if (!uni.$u.test.isEmpty(this.form.address_id)) {
					this.getAddressDetail();
				} else {
					this.getRegion();
				}
			},
		},
	}
</script>

<style lang="scss" scoped>
	.container {
		padding: 20rpx 30rpx;

		.map {
			border-radius: 16rpx;
			padding: 32rpx;

			.map-con {
				width: 100%;
				height: 196rpx;
			}

			.map-select {
				// margin-top: 20rpx;
			}
		}
		.receiveDetail{
			display: flex;
			justify-content: space-between;
			align-items: center;
			.viewAddress{
				max-width: 450rpx;
				.address{
					font-weight: bold;
				}
				.region{
					margin-top: 10rpx;
					color: #858585;
					font-size: 26rpx;
				}
			}
			
		}
		.form {
			padding: 40rpx 32rpx;
			border-radius: 16rpx;
			margin-bottom: 20rpx;
			margin-top: 22rpx;

			.form-item {

				.form-item-label {
					font-size: 28rpx;
					color: #333333;
					margin-bottom: 10rpx;
				}

				input {
					height: 96rpx;
					border-radius: 20rpx;
					background: #F6F6F6;
					padding: 0 30rpx;
				}
			}

			.form-item+.form-item {
				margin-top: 20rpx;
			}
		}
	}
</style>